<!--评价等次明细表-->
<template>
  <el-dialog title="添加" :visible.sync="visible">
    <div class="divider"></div>
    <el-form
      :model="dataForm"
      :rules="dataRule"
      ref="dataForm"
      class="dataForm"
      @keyup.enter.native="dataFormSubmit()"
      label-width="140px"
      style="width: 100%"
    >
      <el-form-item label="事件填报:" prop="module">
        <el-radio-group v-model="dataForm.module">
          <el-radio label="PERSON">个人</el-radio>
          <el-radio label="DEPT">机构</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="考核对象选择:" prop="name">
        <el-button type="primary" @click="chooseBtn">选择</el-button>
      </el-form-item>
      <el-form-item label="已选人员/机构:" prop="name">
        <span v-if="types == 'sy'"
          ><span v-for="(item, index) in perList" :key="index"
            >{{ item.shouyueZhiwu }}-{{ item.shouyueName }}、</span
          ></span
        >
        <span v-if="types == 'jg'"
          ><span v-for="(item, index) in perList" :key="index"
            >{{ item.deptName }}、</span
          ></span
        >
      </el-form-item>
      <div class="divider"></div>
      <el-form-item label="关联奖金项：:" prop="bonus">
        <el-select
          v-model="dataForm.bonus"
          placeholder="请选择关联奖金项:"
          style="width: 100%"
        >
          <el-option label="优秀" value="shanghai"></el-option>
          <el-option label="及格" value="beijing"></el-option>
        </el-select>
      </el-form-item>
      <el-row :gutter="16">
        <el-col :span="12">
          <el-form-item label="事件类别:" prop="eventCate">
            <el-select
              v-model="dataForm.eventCate"
              placeholder="请选择事件类别"
              style="width: 100%"
            >
              <el-option label="1" value="shanghai"></el-option>
              <el-option label="2" value="beijing"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="考核依据:" prop="basis">
            <el-select
              v-model="dataForm.basis"
              placeholder="请选择奖考核依据"
              style="width: 100%"
            >
              <el-option label="依据1" value="shanghai"></el-option>
              <el-option label="依据12" value="beijing"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="16">
        <el-col :span="12">
          <el-form-item label="加扣分值:" prop="score">
            <el-input
              v-model="dataForm.score"
              placeholder="加扣分值"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="加扣奖金:" prop="salary">
            <el-input
              v-model="dataForm.salary"
              placeholder="加扣奖金"
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="16">
        <el-col :span="12">
          <el-form-item label="是否持续性扣罚:" prop="conti">
            <el-select
              v-model="dataForm.conti"
              placeholder="请选择奖考核依据"
              style="width: 100%"
            >
              <el-option label="是" value="shanghai"></el-option>
              <el-option label="否" value="beijing"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="结束时间:" prop="endTime">
            <el-date-picker
              type="date"
              value-format="yyyy-MM-dd"
              placeholder="选择日期"
              v-model="dataForm.endTime"
              style="width: 100%"
            ></el-date-picker>
          </el-form-item>
        </el-col>
      </el-row>
      <el-form-item label="事件描述" prop="des">
        <el-input
          type="textarea"
          placeholder="事件描述"
          v-model="dataForm.des"
        ></el-input>
      </el-form-item>
    </el-form>
    <el-row
      type="flex"
      justify="space-around"
      style="text-align: center; margin-top: 20px"
    >
      <el-col :span="6"
        ><el-button type="primary" @click="dataFormSubmit()"
          >确定</el-button
        ></el-col
      >
      <el-col :span="6"
        ><el-button @click="$emit('close')">取消</el-button></el-col
      >
    </el-row>
    <UserCommonSelect
      v-if="usercomment"
      ref="usercomment"
      @submitfy="submitfy"
    ></UserCommonSelect>
  </el-dialog>
</template>

<script>
import { save } from "@/api/assessment/event";
import UserCommonSelect from "@/views/hetongrenwu/components/usercomment-select";
export default {
  components: {
    UserCommonSelect,
  },
  props: {
    visible: false,
  },
  data() {
    return {
      types: "",
      canSubmit: false,
      usercomment: false,
      dataForm: {
        module: "PERSON",
      },
      perList: [],
      dataRule: {
        aa: [{ required: true, message: "所属等次不能为空", trigger: "blur" }],
      },
    };
  },
  methods: {
    chooseBtn() {
      this.usercomment = true;
      if (this.dataForm.module == "PERSON") {
        this.$nextTick(() => {
          this.$refs.usercomment.init("12", "sy");
        });
      } else if (this.dataForm.module == "DEPT") {
        this.$nextTick(() => {
          this.$refs.usercomment.init("12", "jg");
        });
      } else {
        this.$message.warning("请选择事件填报");
      }
    },
    submitfy(data) {
      this.perList = [];
      this.types = "";
      this.perList = data.tableDataUser;
      this.types = data.type;
    },
    // 表单提交
    dataFormSubmit() {
      let list = [];
      if (this.types == "sy") {
        list = this.perList.map((v) => v.userId);
      } else if (this.types == "jg") {
        list = this.perList.map((v) => v.deptId);
      }
      this.$refs["dataForm"].validate((valid) => {
        if (valid) {
          this.canSubmit = false;
          save(Object.assign(this.dataForm, { ids: list }))
            .then((data) => {
              this.$notify.success("添加成功");
              this.$emit("close");
            })
            .catch(() => {
              this.canSubmit = true;
            });
        }
      });
    },
  },
};
</script>
<style>
.divider {
  width: 100%;
  height: 1px;
  background: #797979;
  margin-bottom: 20px;
}
.dataForm .el-input--small .el-input__inner {
  height: 35px !important;
  line-height: 35px !important;
  border: 1px solid #ccccda;
  border-radius: 5px;
  background: linear-gradient(45deg, #f4f4fc, #f5f5f5);
  font-size: 16px;
  color: #303745;
  overflow: hidden;
}
</style>
